<template>
  <div>
    <div id="vue-hls-player"></div>
    <!-- {{ $version }} -->
    <!-- <pre>{{ BrowserType }}</pre> -->
    <!-- <pre>{{ u }}</pre> -->
  </div>
</template>

<script>
import Player from 'xgplayer';
import 'xgplayer/dist/index.min.css';
import HlsPlugin from 'xgplayer-hls.js';

import { BrowserType } from '@/assets/BrowserType.js';

export default {
  name: 'xg',
  data() {
    return {
      BrowserType: BrowserType(),
      // url: 'https://boliu.chenxi618.com/xinmantang3/xinmantang3.m3u8',
      url:
        'https://c1--cn-gotcha208.bilivideo.com/live-bvc/940444/live_35613568_7391549_bluray/index.m3u8?expires=1753086447&len=0&oi=993560309&pt=web&qn=10000&trid=100764f34adb4f66cd5b1e24bbb32d687deb&bmt=1&sigparams=cdn,expires,len,oi,pt,qn,trid,bmt&cdn=cn-gotcha208&sign=acd8e45f1b7aec7acb5d55fa7fafe5a9&site=2145d64f7c5104e3fc5fbeb1fb65f2cb&free_type=0&mid=400216183&sche=ban&bvchls=1&trace=16&isp=ct&rg=East&pv=Fujian&info_source=cache&score=48&long_ab_id=45&strategy_version=latest&long_ab_flag_value=test&long_ab_flag=live_default_longitudinal&sl=1&hot_cdn=57345&p2p_type=1&ld=xs&flvsk=4207df3de646838b084f14f252be3aff32e9f79d88eba2913a6cbca8199656ed&origin_bitrate=766537&expected_qn=10000&strategy_ids=11&strategy_types=0&pp=srt&codec=0&source=puv3_onetier&strategy_type=0&sk=5bf07b9bbe6df2e0a6bc476fe3d9a64272675319e1bf242748fcda5ad9e12f7b&media_type=0&suffix=bluray&strategy_id=11&deploy_env=prod&hdr_type=0&vd=bc&src=puv3&order=1',
      u: navigator.userAgent.toLowerCase(),
    };
  },
  mounted() {
    if (HlsPlugin.isSupported()) {
      new Player({
        el: document.querySelector('#vue-hls-player'),
        url: this.url,
        isLive: true,
        plugins: [HlsPlugin],
        autoplay: true,
        autoplayMuted: false,
        fluid: true,
        width: '100%',
        height: '300px',
      });
    }
  },
};
</script>
